<template>
    <div class="page reset">
        <nav-bar title="重置密码" @click-left="$router.back()"></nav-bar>
        <div class="reset_con">
            <login-form :formConfig="formConfig" @submit="formSubmit" ref="loginForm">
                <template v-slot:other>
                    <div class="form_sort"></div>
                </template>
            </login-form>
        </div>
    </div>
</template>

<script>

import LoginForm from "@/components/form/login-form";
import { mapMutations } from 'vuex'

const FormConfig = {
    tell: {
        lable: "手机号",
        placeholder: "请输入手机号"
    },
    code: {
        lable: "验证码",
        placeholder: "请输入验证码"
    },
    pwd: {
        lable: "新密码",
        placeholder: "请输入密码"
    },
    conformPwd: {
        lable: "确认密码",
        placeholder: "再次输入密码"
    },
    butt: {
        text: "确认"
    }
}

export default {
    data() {
        return {
            formConfig: FormConfig
        }
    },

    provide: function () {
        return {
            sendCode: this.sendCode
        }
    },

    components: { LoginForm },

    computed: {
    },

    methods: {
        ...mapMutations({
            setUserInfo: "setUserInfo",
        }),

        // 返回按钮
        navBack() {
            this.$router.back();
        },

        // 发送验证码
        sendCode() {
            let _mobilePhone = this.$refs.loginForm.mobilePhone;
            if (this.$check.start(_mobilePhone, "手机号").isNull().isTell().endShow()) {
                return Promise.resolve(false);
            }
            let params = {
                mobilePhone: _mobilePhone,
            }
            return this.$http.smsModifyPwd(params);
        },

        // 登录
        formSubmit(e) {
            const { mobilePhone, password, smsCode } = e;
            let params = {
                mobilePhone: mobilePhone,
                smsCode: smsCode,
                password: password,
                confirmPassword: password,
            }
            this.$http.modifyPwd(params).then(respData => {
                if (respData === false) {
                    return;                    
                }
                this.$router.back();
            });
        }
    }
};
</script>

<style lang="scss" scoped>
.reset {
    .reset_con {
        width: 100%;
        padding: 20px 0;

        .form_sort {
            padding: 10px 10px 40px 10px;
        }
    }
}
</style>